import React from 'react'
import { RouteObject } from 'react-router-dom'
import AsyncComponent from './AsyncComponent'

const Login = AsyncComponent(() => import(/* webpackChunkName: "login" */ '@pages/login/index'))
const NotFound404 = AsyncComponent(() => import(/* webpackChunkName: "error-pages" */ '@pages/error-pages/404'))
const Layout = AsyncComponent(() => import(/* webpackChunkName: "layouts" */ '@src/layouts/index'))
const DashBoard = AsyncComponent(() => import(/* webpackChunkName: "dash-board" */ '@pages/dash-board'))

const routes: RouteObject[] = [
  {
    path: '/',
    children: [
      {
        index: true,
        element: <Login />,
      },
    ],
  },
  {
    path: 'home',
    element: <Layout />,
    children: [
      {
        path: 'dash-board',
        element: <DashBoard />,
      },
    ],
  },
  {
    path: '*',
    element: <NotFound404 />,
  },
]

export default routes
